{% extends "myadmin/base.html" %}
{% load static from staticfiles %}
{% block mainbody %}
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            会员管理
            <small>订餐系统后台管理</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
            <li class="active">会员管理</li>
        </ol>
    </section>

    <!-- Main content -->
    <section class="content container-fluid">

        <div class="row">
            <div class="col-xs-12">
                <div class="box">
                    <div class="box-header">
                        <h3 class="box-title">会员信息表</h3>

                        <div class="box-tools">
                            <div class="input-group input-group-sm" style="width: 150px;">
                                <input type="text" name="table_search" class="form-control pull-right"
                                       placeholder="Search">

                                <div class="input-group-btn">
                                    <button type="submit" class="btn btn-default"><i class="fa fa-search"></i></button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- /.box-header -->
                    <div class="box-body table-responsive no-padding">
                        <table class="table table-hover">
                            <tr>
                                <th>ID</th>
                                <th>昵称</th>
                                <th>头像</th>
                                <th>联系电话</th>
                                <th>当前状态</th>
                                <th>添加时间</th>
                                <th>修改时间</th>
                                <th width="200">操作</th>
                            </tr>
                            {% for vo in userslist %}
                            <tr>
                                <td>{{ vo.id }}</td> <!-- ID -->
                                <td>{{ vo.nickname }}</td> <!--昵称-->
                                <td><img class="direct-chat-img" style="width:25px;height:25px"
                                         src="{% static 'myadmin/dist/img/user7-128x128.jpg' %}"
                                         alt="message user image"></td> <!--头像-->
                                <td>{{ vo.mobile }}</td> <!--联系电话-->
                                <td><span class="label label-success">
                    {% if 1 == vo.status %}正常
                    {% elif 2 == vo.status %}禁用
                    {% elif 9 == vo.status %}删除
                    {% endif %}</span></td> <!--当前状态-->
                                <td>{{ vo.create_at }}</td> <!--添加时间-->
                                <td>{{ vo.update_at }}</td> <!--修改时间-->
                                <td>
                                    <button type="button" class="btn btn-success btn-xs" data-toggle="modal"
                                            data-target="#mEdit_{{vo.id}}">
                                        <span class="glyphicon glyphicon-edit" aria-hidden="true"></span> 编辑
                                    </button>
                                    <button id="buttonDel" type="button" class="btn btn-danger btn-xs" data-toggle="modal" onclick="DelAlert({{ vo.id }})">
                                        <span class="glyphicon glyphicon-trash" aria-hidden="true"></span> 删除
                                    </button>
                                    <button type="button" class="btn btn-warning btn-xs" onclick="FindOrders({{ vo.id }})" ">
                                        <span class="glyphicon glyphicon-search" aria-hidden="true"></span> 查看订单
                                    </button>
                                </td>
                            </tr>
                            <!-- Modal -->
                            <div class="modal fade" id="mEdit_{{vo.id}}" tabindex="-1" role="dialog"
                                 aria-labelledby="myModalLabel">
                                <div class="modal-dialog" role="document">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                                    aria-hidden="true">&times;</span></button>
                                            <h4 class="modal-title" id="myModalLabel">会员信息编辑</h4>
                                        </div>
                                        <div class="modal-body">
                                            <form action="{% url 'myadmin_member_update' %}" method="post"
                                                  enctype="multipart/form-data" class="form-horizontal">
                                                {% csrf_token %}
                                                <div class="form-group">
                                                    <label for="inputUID" class="col-sm-2 control-label">ID</label>
                                                    <div class="col-sm-10">
                                                        <input id="inputUID" name="uid" type="text" class="form-control"
                                                               placeholder="ID" aria-describedby="basic-addon1" name="nickname"
                                                               value="{{ vo.id }}" readonly>
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label for="inputNICK" class="col-sm-2 control-label">昵称</label>
                                                    <div class="col-sm-10">
                                                        <input id="inputNICK" type="text" class="form-control"
                                                               placeholder="Nick Name"
                                                               aria-describedby="basic-addon1" name="nickname"
                                                               value="{{ vo.nickname }}">
                                                    </div>
                                                </div>
                                                <div class="form-group">

                                                    <label for="inputPHONE" class="col-sm-2 control-label">手机号</label>
                                                    <div class="col-sm-10">
                                                        <input id="inputPHONE" name="mobile" type="text" class="form-control"
                                                               placeholder="Mobile"
                                                               aria-describedby="basic-addon1" value="{{ vo.mobile }}">
                                                    </div>

                                                </div>
                                                <div class="form-group">
                                                    <input type="radio" name="status" value="1" {% if vo.status == 1 %}checked="true" {% endif %}>正常
                                                    <input type="radio" name="status" value="2" {% if vo.status == 2 %}checked="true" {% endif %}>禁用
                                                    <input type="radio" name="status" value="9" {% if vo.status == 9 %}checked="true" {% endif %}>删除
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="submit" class="btn btn-primary">保存</button>
                                                </div>
                                            </form>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            {% endfor %}
                        </table>
                    </div>

                    <!-- /.box-body -->
                    {% include 'myadmin/pager.html' %}
                    <!-- /.box -->
                </div>
            </div>

    </section>
    <!-- /.content -->
</div>
<div id="modAlert" class="modal">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
        <h5 class="modal-title"><i class="fa fa-exclamation-circle"></i> 信息提示</h5>
      </div>
      <div class="modal-body small">
        <p>确定删除吗？</p>
      </div>
      <div class="modal-footer" >
        <button id="btnOk" type="button" class="btn btn-primary ok" data-dismiss="modal" >确定</button>
        <button type="button" class="btn btn-default cancel" data-dismiss="modal">取消</button>
      </div>
    </div>
  </div>
</div>

<!-- 订单信息模板 -->
<div class="modal fade" id="modOrder" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="modOrder_h4">订单信息</h4>
            </div>
            <div class="modal-body">
            <div id="modOrder_context"></div>
            </div>
        </div>
    </div>
</div>
<!-- /.content-wrapper -->
<script type="text/javascript">
    function DelMem(uid) {
       /* $.post("{% url 'myadmin_member_del' %}", { "uid": uid },
          function(data){
          alert("Data Loaded: " + data);
          }); */
        $.ajaxSetup({
            data:{csrfmiddlewaretoken:'{{ csrf_token }}'},
        });

        $.ajax({
            url:"{% url 'myadmin_member_del' %}",
            data:{"uid": uid},
            type:"POST",
            success:function (data) {
                alert(data)
            }
        })
    }
    function DelAlert(uid) {
        $('#btnOk').attr("onclick", "DelMem("+uid+")");
        $('#modAlert').modal('show');
    }; 
    function FindOrders(uid) {
        $.ajaxSetup({
            data:{csrfmiddlewaretoken:'{{ csrf_token }}'},
        });

        $.ajax({
            url:"{% url 'myadmin_member_orders' %}",
            data:{"uid": uid},
            type:"POST",
            success:function (data) {
                document.getElementById('modOrder_context').innerHTML = data;
                $('#modOrder').modal('show');
            }
        }) 
    }
</script>
{% endblock %}